<template>
  <el-table :data="tableData" border style="width: 100%" 
  header-row-class-name="headClass"
  @row-click="rowClick">
    <el-table-column prop="id" label="id"> </el-table-column>
    <el-table-column prop="name" label="名称"> </el-table-column>
    <el-table-column prop="price" label="单价"> </el-table-column>
    <el-table-column prop="count" label="数量"> </el-table-column>
  </el-table>
</template>
<script setup lang="ts">
import mock from '@/mock'
mock.getdevicelist()
mock.addDevice()
import { onMounted,ref } from 'vue'
import { useRouter } from 'vue-router'
let router = useRouter()
import axios from '@/axios'
let tableData = ref([]);
  onMounted(()=>{
    axios.get('/getdevicelist').then(res=>{
      tableData.value = res.list
    })
    axios.post('/addDevice',{name: '大分类进'}).then(res=>{
      console.log('res',res)
    })
  })
  let rowClick = row => {
    // router.push({path: `/device/deviceDetail/${row.id}`,params: {id: row.id}})
    router.push({name: 'deviceDetail',params: {id: row.id}})
  }
</script>
<style lang="scss">
.headClass{
  position: sticky !important;
  top: 0;
  left: 0;
  z-index: 9999;
  background: #f99;
}
</style>